<template>
	<!--el-drawer
		ref="reviewDrawer"
		title="变更管理员"
		v-model="drawer"
		:destroy-on-close="true"
		size="70%"-->
		<ex-dialog v-model="visible" draggable :title="'变更管理员'"
		width="1300" contentHeight=615 top="5">
		<template #default>
			<el-container>
				<el-aside style="padding-left: 20px;width: 260px;">
					<el-form-item label="盘点管理员">
						<div class="assetCodeList" :style="'height:'+assetCodeListHeight+'px;'">
							<template v-for="(checkManageUser,index) in checkManageUsers">
								<div style="float:left;">
									<ex-label :key="checkManageUser" code="SysUser" :value="checkManageUser"></ex-label>
								</div>
								<div style="float: left">
									<el-icon size="small" @click="removeCode(index)">
										<component is="el-icon-circle-close"></component>
									</el-icon>
								</div>
							</template>
						</div>
					</el-form-item>
				</el-aside>
				<el-main v-loading="loading">
					<el-container>
						<el-aside class="nopadding dialogsearch" style="width: 300px;margin-left: 0px;">
							<search-form v-if="searches" :searches="searches" :search-form="searchForm"></search-form>
							<div style="flex: auto;text-align: center;padding-left: 40px;">
								<el-button plain type="primary" icon="el-icon-search" @click="searchHandler" :loading="loading">
									{{ $t('button.search_ok') }}
								</el-button>
								<el-button plain type="warning" icon="el-icon-brush" @click="resetHandler">
									{{ $t('button.search_clear') }}
								</el-button>
							</div>
						</el-aside>
						<el-main class="nopadding" style="margin-bottom: 10px;">
							<ex-table id="assetTable" ref="selecterTable" :columns="columns" :height="490" size="small"
									  :url="url" :params="form" :refs="this.$refs" @columnClick="columnClickHandler"
									  selectionType="checkbox">
							</ex-table>
							<div style="flex: auto;text-align: center;margin-top: 5px;margin-bottom: 10px;">
								<el-button plain type="primary" @click="saveCheckManageUser" :loading="loading">确 定</el-button>
							</div>
						</el-main>
					</el-container>
				</el-main>
			</el-container>
		</template>
		<template #footer>
			<div style="flex: auto;text-align: center">
				<el-button plain type="primary" @click="changeCheckUser" :loading="loading">
					确 定
				</el-button>
				<el-button plain type="info" icon="el-icon-close" @click="visible=false" :loading="loading">
					取 消
				</el-button>
			</div>
		</template>
	</ex-dialog>
	<!--/el-drawer-->
</template>

<script>

import ExLabel from "@/components/exLabel/index.vue";
import ExSelect from "@/components/exSelect/index.vue";
import ExTable from "@/components/exTable/index.vue";
import {defineAsyncComponent} from "vue";
import entity from "@/constant/model/entity";
import exDialog from '@/components/exDialog';

export default {
	name: 'changeCheckUser',
	components: {
		SearchForm:defineAsyncComponent(() => import('@/components/exSearch/search_form.vue')),
		ExTable,
		ExSelect,
		ExLabel,
		exDialog
	},
	data() {
		return {
			visible: false,
			form: {},
			model: {},
			loading: false,
			oldForm: null,
			searchForm: {},
			searches: null,
			columns: [],
			url: null,
			selectorName: null,
			assetCodeListHeight: 0,
			pdfIframeHeight: 0,
			checkManageUsers: [],
			documentId:null,
		}
	},
	created() {
	},
	mounted() {
		this.resetHeight();
		window.addEventListener("resize", this.resetHeight);
	},
	beforeUnmount() {
		window.removeEventListener("resize", this.resetHeight);
	},
	methods: {
		initData() {
			if (this.form.selector === entity.FamsCostCenter.name) {
				this.searches = [
					{type: "input", name: "编码", code: "costCenterCode"},
					{type: "input", name: "名称", code: "costCenterName"},
					{type: "input", name: "财务编码", code: "other.cwCode"},
				];
				this.columns = [
					{code: "costCenterCode", name: "编码", width: "180"},
					{code: "costCenterName", name: "名称", width: ""},
					{code: "other.cwCode", name: "财务编码", width: "100"},
					{code: "other.type", name: "类型", width: "60"},
				];
				this.url = this.$API.system.costcenter.list.url;
				this.selectorName = "成本中心";
			} else if (this.form.selector === entity.SysUser.name) {
				this.searches = [
					{type: "input", name: "员工名称", code: "userName"},
					{type: "input", name: "员工编号", code: "userCode"},
				];
				if(this.form._preRelationProp){
					this.form.orgId = this.form._preRelationProp;
				}else{
					this.searches.push({type: "tree-select", name: "所在部门", code: "orgId",dictCode:"SysOrganization",priKey:true});
				}
				this.columns = [
					{code: "orgId", name: "所在部门", width: "",formatter:"DICT",key:"SysOrganization"},
					{code: "userName", name: "员工名称", width: ""},
					{code: "employee.employeeStatus", name: "员工状态", width: "100",formatter:"DICT",key:"EMPLOYEE_STATUS"},
				];
				this.url = this.$API.system.operator.list.url;
				this.selectorName = "人员";
			}else if (this.form.selector === entity.FamsProvider.name) {
				this.searches = [
					{type: "input", name: "编码", code: "providerCode"},
					{type: "input", name: "名称", code: "providerName"},
					{type: "input", name: "联系人", code: "contactName"},
					{type: "input", name: "联系电话", code: "contactPhone"},
				];
				this.columns = [
					{code: "providerCode", name: "编码", width: "200"},
					{code: "providerName", name: "名称", width: ""},
				];
				this.url = this.$API.system.provider.list.url;
				this.form.relDeptId = this.$TOOL.current.user().orgId;//查询当前登录人所在部门的承担成本中心的供应商信息
				this.selectorName = "供应商";
			}else if (this.form.selector === entity.SysOrganization.name) {
				this.searches = [
					{type: "input", name: "部门名称", code: "orgName"},
					{type: "input", name: "部门编号", code: "orgCode"},
				];
				this.columns = [
					{code: "orgCode", name: "部门编号", width: "200"},
					{code: "orgName", name: "部门名称", width: ""},
				];
				this.url = this.$API.system.dept.list.url;
				this.selectorName = "部门";
			}else {
				this.$message.error("未找到适配的选择器");
			}
		},
		resetHeight() {
			this.assetCodeListHeight = window.innerHeight - 205;
			this.pdfIframeHeight = window.innerHeight - 170;
		},
		async searchHandler() {
			await this.$refs.selecterTable.refresh(this.searchForm);
		},
		resetHandler() {
			this.searchForm = {};
		},
		columnClickHandler(name, data) {
			console.log(name);
			console.log(data);
			this.$options.methods[name](this, data);
		},
		open(data) {
			this.visible = false;
			this.form = {};
			this.checkManageUsers = [];
			this.documentId = '';
			this.searchForm = {};
			if(data){
				Object.assign(this.checkManageUsers, data.checkManageUsers);
				this.documentId = data.documentId;
				this.form._preRelationProp = data.orgId;
			}
			this.form.isEnabled = '1';
			this.form.selector = 'SysUser';
			
			this.initData();
			this.visible = true;
		},
		removeCode(index) {
			this.checkManageUsers.splice(index, 1);
		},
		saveCheckManageUser(){
			let selection = this.$refs.selecterTable.selections();
			if (selection.length === 0) {
				this.$message.warning(i18n.global.tc("common.please_select_data"));
				return;
			}
			//let checkManageUserId = this.$refs.selecterTable.selectionOne().id;
			for (let index = 0; index < selection.length; index++) {
				const element = selection[index];
				let checkManageUserId =element.id;
				if(!this.checkManageUsers.includes(checkManageUserId)){
				this.checkManageUsers.push(checkManageUserId);
				this.searchHandler();
			}
			}
			
		},
		changeCheckUser(){
			let entity = {
				checkManageUser:[],
				id:this.documentId,
			}
			if(this.checkManageUsers.length === 0){
				this.$message.warning("盘点单管理员不能为空");
				return;
			}
			Object.assign(entity.checkManageUser, this.checkManageUsers);
			this.loading = true;
			
			try {
				this.$API.asset.checkDocumentApi.updateCheckManageUser.post(entity).then((reasult) => {
					if (reasult.code === 2000) {
						this.loading = false;
						this.$emit('success');
						this.visible = false;
					} else {
						this.$message.warning(reasult.message)
					}
					this.loading = false;
				});
			} catch  {
				this.loading = false;
			}
		}
	}
}
</script>

<style scoped>
.pdfIFrame {
	width: 100%;
	overflow: auto;
	border: 0;
}

.assetCodeList {
	width: 100%;
//height: 100%; //border: 1px solid #a6aab1; margin-right: 10px;
}
</style>
